<template>
  <div class="headerbox">
    <div class="header">
      <div class="headerL">
        <a onclick="javascript:history.back(-1)" class="goback"><img src="/images/goback.png" /></a>
      </div>
      <div class="headerC">
        <p>优惠券列表</p>
      </div>
    </div>
  </div>
  <div class="clear"></div>
  <div class="h50"></div>
  <div class="coupon_list" v-for="item in couponData">
    <div class="coupon_item">
      <div class="item_content">
        <router-link :to="{name:'couponInfo',query:{id:item.id}}">
          <div class="left">
            {{ item.valueDesc }}<span>{{ item.unitDesc }}</span>
          </div>
          <div class="right">
            <div>{{ item.name }}</div>
            <div v-if="item.rstatus==1">订单满<span>{{item.condition_price}}元</span>打<span>{{item.valueDesc}}{{ item.unitDesc }}</span></div>
            <div v-else>订单满<span>{{item.condition_price}}元</span>减<span>{{item.valueDesc}}{{ item.unitDesc }}</span></div>
            <div>每人限领1张</div>
            <div>领取后10天内有效</div>
          </div>
        </router-link>
      </div>
      <div class="item_btn">
        <router-link class="right_btn" style="line-height: 20px !important;" :to="{name:'couponInfo',query:{id:item.id}}">
          优惠详情
        </router-link>
        <!-- <a  href="coupon-info.html"></a> -->
      </div>
    </div>
    <!-- <div class="coupon_item">
      <div class="item_content">
        <a href="coupon-info.html">
          <div class="left">
            8<span>折</span>
          </div>
          <div class="right">
            <div>新店优惠券</div>
            <div>订单满<span>100元</span>打<span>8折</span></div>
            <div>每人限领1张</div>
            <div>领取后10天内有效</div>
          </div>
        </a>
      </div>
      <div class="item_btn">
        <a class="right_btn" href="coupon-info.html">优惠详情</a>
      </div>
    </div>
    <div class="coupon_item">
      <div class="item_content">
        <a href="coupon-info.html">
          <div class="left">
            8<span>折</span>
          </div>
          <div class="right">
            <div>新店优惠券</div>
            <div>订单满<span>100元</span>打<span>8折</span></div>
            <div>每人限领1张</div>
            <div>领取后10天内有效</div>
          </div>
        </a>
      </div>
      <div class="item_btn">
        <a class="right_btn" href="coupon-info.html">优惠详情</a>
      </div>
    </div> -->
  </div>
  <div class="more">没有更多了</div>
</template>

<script setup>
import { ref, computed, onMounted, watch,reactive } from 'vue';
import { showSuccessToast, showFailToast } from 'vant';
import { showConfirmDialog, showToast } from 'vant';
import { POST } from '../services/request.js'
import { useRouter } from "vue-router";


onMounted(async () => {
  getCouponList();
})
const couponData = ref([])
const userData = reactive(JSON.parse(localStorage.getItem('LoginUser')))

// console.log(userData.id);


// 获取优惠卷列表
const getCouponList = async () => {
  const getCouponRes = await POST({
    url:'/Coupon/getCoupon',
    params:{
      uid:userData.id,
      mobile:userData.mobile
    }
  })
  if(getCouponRes.code === 1){
    // console.log(getCouponRes.data);
    couponData.value = getCouponRes.data;
  }
}

// 点击加入详情
const couponInfo=async(id)=>{
  console.log(id);
  
}


</script>